<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>智慧社区-社区报修</title>

    <!-- Bootstrap -->
    <link href="<s:url value="/assets/front/css/bootstrap.min.css"></s:url>" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="<s:url value="/assets/front/css/common.css"></s:url>" />
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="//cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<%@include file="/WEB-INF/views/front/include/menu.jsp"%>
    <div class="container" style="background-color: #ffffff;margin-top: 20px" >
        <div class="row" style="margin-top: 20px"></div>
        <div class="panel panel-default" style="margin-left: 100px;margin-right: 100px;">
            <div class="panel-heading">
                <h3 class="panel-title text-center">用户注册</h3>
            </div>
            <div class="panel-body">
                <form:form commandName="databean" cssClass="form-horizontal" role="form" action="${pageContext.request.contextPath}/register" method="post" id="register-form">
                    <div class="form-group">
                        <label class="col-sm-2 control-label no-padding-right" for="name">昵称：</label>
                        <div class="col-sm-8">
                            <input type="text" name="name" id="name" placeholder="请输入昵称" class="form-control required">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label no-padding-right" for="gender">性别：</label>
                        <div class="col-sm-8">
                            <form:select path="gender" items="${redis:getDictList('Gender',false)}" itemValue="basId" itemLabel="name" cssClass="form-control"></form:select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label no-padding-right" for="username">用户名：</label>
                        <div class="col-sm-8">
                            <input type="text" name="username" id="username" placeholder="请输入用户名" class="form-control required">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 control-label no-padding-right" for="password">密码：</label>
                        <div class="col-sm-8">
                            <input type="password" name="password" id="password" placeholder="请输入密码" class="form-control required">
                        </div>
                    </div>

                </form:form>
                <h3 class="header smaller lighter green"></h3>
                <div class="text-center">
                    <button class="btn btn-info" id="save">注册</button>
                </div>
            </div>
        </div>
    </div>



<%@include file="/WEB-INF/views/front/include/footer.jsp"%>
<script src="<s:url value="/assets/js/valid/jquery.validate.js"></s:url>"></script>
<script src="<s:url value="/assets/js/valid/messages_cn.js"></s:url>"></script>
<script type="text/javascript">
    $("#save").click(function () {
        save();
    });

    function save() {
        if($("#register-form").valid()) {
            var name = $('#name').val();
            var gender = $('#gender').val();
            var username = $('#username').val();
            var password = $('#password').val();
            $.ajax({
                type : "post",
                url : "${pageContext.request.contextPath}/register",
                data:
                    {
                    "name":name,
                    "gender":gender,
                    "username":username,
                    "password":password
                    },
                dataType : "json",
                success : function(datas) {
                    if(datas.code == '200'){
                        alert("注册成功")
                        location.href = "${pageContext.request.contextPath}/login";
                    } else if(datas.code == '500') {
                        alert(datas.message);
                    } else {
                        location.href = "${pageContext.request.contextPath}/register";
                    }
                },
                error :function(xhr) {
                    location.href = "${pageContext.request.contextPath}/register";
                }
            });
        }

    }
</script>
</body>
</html>
